<template>
  <el-col :span="options.span || 22">
    <el-form-item :label="options.label" :label-width="options.labelWidth" :prop="options.prop">
      <el-date-picker
        style="width:100%;"
        v-bind="$attrs"
        :clearable="options.clearable"
        :type="options.type"
        :default-value="options.defaultValue"
        :value-format="options.valueFormat || 'yyyy-MM-dd'"
        :disabled="setValue(options.disabled)"
        v-model="inputVal"
        :placeholder="options.placeholder"
      ></el-date-picker>
    </el-form-item>
  </el-col>
</template>

<script>
import { dataType } from "@/lib/utils/validate";
export default {
  props: {
    value: null,
    options: {
      type: Object,
      default() {
        return {
          disabled: "",
          clearable: true,
          defaultValue: "",
        };
      },
    },
  },
  computed: {
    inputVal: {
      get: function () {
        return this.value;
      },
      set: function (e) {
        this.$emit("input", e);
      },
    },
  },
  methods: {
    setValue(item) {
      if (dataType(item) === "function") return item();
      return item;
    },
  },
};
</script>

<style>
</style>